
<style>
hover{
color: rgb(102, 102, 102); box-shadow: rgba(35, 25, 25, 0.496094) 0px 1px 5px; -webkit-box-shadow: rgba(35, 25, 25, 0.496094) 0px 1px 5px; 
}
</style>
<div class="header" id="header" style="width: 800px height:0px">
      <div class="m-nav m-fixed" style="width: 800px">
        <div class="  ">
          <ul class="channel clearfix">
            <li>
              <?php echo CHtml::link('最新',array('webgl/facility/','pageNo'=>1,'pageSize'=>4),array( 'class'=>"on"))?>
            </li>
            <li>
              <?php echo CHtml::link('test',array('webgl/build/'))
              ?>
            </li>
            <li>
              <?php echo CHtml::link('我装修',array('webgl/test/'))?>
            </li>
            <li>
              <?php echo CHtml::link('我的房',array('webgl/showHouse/'))?>
            </li>
          </ul>
          
        </div>
      </div>
    </div>
  
  <section id="content">

<div id="container" class="transitions-enabled clearfix">

<?php foreach( $houseStyles as $h){ ?>

  <div class=" col1 goods" id="<?php echo $h->id?>">
    <div class="goods-pic" style="height:213px">
      <a href="" title="<?php echo $h->houseName?>" target="_blank"> <img src="<?php echo $h->thumbnailPath?>" title="<?php echo $h->houseName?>" alt="<?php echo $h->houseName?>" height="213px"> </a>
      <a class="ilike-m" href="javascript:void(0);" data-type="0" data-proid="1138079" style="display: block; ">喜欢</a>
    </div>
    <div class="goods-stat clearfix">
      <span class="like-num">面积(平方米): <em class="like-count" id="<?php echo $h->id.'barea'?>"><?php echo $h->area?> </em></span>
      <span class="fr ml5">评论: 9</span>
    </div>
    <ul class="comments">
      <li class="address" id="<?php echo $h->id.'baddress'?>">
        <?php echo $h->address?>
      </li>
      <li class="desc" id="<?php echo $h->id.'hdesc'?>">
        <?php echo $h->description?>
      </li>
      <li>
       楼盘： <span class="bname" id="<?php echo $h->id.'bname'?>"><?php echo $h->BuildingInfos->name?></span>
      </li >
      <li>
       开发商： <span class="bsupplier" id="<?php echo $h->id.'bsupplier'?>"><?php echo $h->Supplier->abbreviation?></span>
      </li >
      <li class="baddr">
        地址：<span class="bname" id="<?php echo $h->id.'haddress'?>"><?php echo $h->BuildingInfos->address?></span>
      </li>
      
      <li class="bdesc" id="<?php echo $h->id.'bdesc'?>">
        <?php echo  $h->BuildingInfos->description?>
      </li>
      
    </ul>
  </div>
 
<?php }?>



  
  
  

</div> <!-- #container -->

<script>
    $( function() {

        var $container = $('#container');

        $container.imagesLoaded( function() {
            $container.masonry({
                itemSelector: '.goods',
                columnWidth: 80
                //isFitWidth: true,
                //isAnimated: !Modernizr.csstransitions
            });
        });
        
        $('.goods').click(function(){
        //need to send the house info into.....
        //build.showHouse({house_id:....,buildname:....,area:....,});
         var id=$(this).attr('id');
         var bname="#"+id+"bname";
         var haddr="#"+id+"baddress";
         var baddr="#"+id+"haddress";
         var bsupplier="#"+id+"bsupplier";
         var addr=$(baddr).html().trim()+" "+$(haddr).html().trim();
         var bdesc="#"+id+"bdesc";
         var hdesc="#"+id+"hdesc";
         var vbdesc=$(bdesc).text().trim();
         var barea="#"+id+"barea";
         build.showHouseStyle({house_id:$(this).attr('id'),building_name:$(bname).text().trim(),building_addr:addr,
                          building_supplier:$(bsupplier).text().trim(),building_desc:vbdesc,house_desc:$(hdesc).html(),
                          house_area:$(barea).text()});
          
          return false;
        });
    });
</script>
  </section> <!-- #content -->